<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="1.css">
    <style>
        /*元素选择器，所有的div标签均采用该样式*/
        div{
            color: blue;
        }
        /*类选择器，所有class属性为head的元素采用该样式*/
        .head{
            background-color: yellow;
        }
        .size{
            font-size: 40px;
        }
        /*id选择器，指定id对应的元素拥有该样式*/
        #ptest{
            background-color: pink;
        }
        /*包含选择器，id为imgDiv中，所有的img子元素拥有该样式*/
        #imgDiv img{
            width: 200px;
            height: 200px;
        }
        /*属性选择器，input标签中，type属性为text的元素拥有该样式*/
        input[type=text]{
            color: red;
        }

        #menuUL{
           display: flex;
        }

        #menuUL li{
            list-style: none;
            width: 200px;
            height: 30px;
            text-align: center;
        }

        #menuUL li:hover{
            background-color: yellow;
            font-size: 20px;
            font-weight: bold;
            color: red;
            cursor: pointer;
        }

        #addDiv{
            position: absolute;
            left:0px;
            top:0px;
            width: 1300px;
            height: 600px;
            background-color: rgba(255,0,0,0.5);
        }
    </style>
<body>
    <div style="color: green">div文字</div>
    <span class="head">span</span>
    <div class="head size">div</div>

    <p id="ptest">段落</p>
    <div id="imgDiv">
        <img src="../img/1.jpg">
        <img src="../img/2.jpg">
        <img src="../img/3.jpg">
        <img src="../img/4.jpg">
        <img src="../img/5.jpg">
        <img src="../img/6.jpg">
    </div>

    <input type="text"><br>
    <input type="text"><br>
    <input type="radio" name="sex" value="man">男
    <input type="radio" name="sex" value="woman">女

    <ul id="menuUL">
        <li>新闻</li>
        <li>财经</li>
        <li>体育</li>
        <li>论坛</li>
    </ul>

    <span>span1</span>
    <span style="display: flex;visibility: hidden">span2</span>
    <span>span3</span>

    <div id="addDiv">

    </div>
</body>
</html>